<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
	<title>用户管理</title>
	<meta name="decorator" content="default"/>
	<%@include file="/WEB-INF/views/include/dialog.jsp" %>
	<style type="text/css">.sort{color:#0663A2;cursor:pointer;}</style>
	<script type="text/javascript">
		$(document).ready(function() {
			// 表格排序
			var orderBy = $("#orderBy").val().split(" ");
			$("#contentTable th.sort").each(function(){
				if ($(this).hasClass(orderBy[0])){
					orderBy[1] = orderBy[1]&&orderBy[1].toUpperCase()=="DESC"?"down":"up";
					$(this).html($(this).html()+" <i class=\"icon icon-arrow-"+orderBy[1]+"\"></i>");
				}
			});
			$("#contentTable th.sort").click(function(){
				var order = $(this).attr("class").split(" ");
				var sort = $("#orderBy").val().split(" ");
				for(var i=0; i<order.length; i++){
					if (order[i] == "sort"){order = order[i+1]; break;}
				}
				if (order == sort[0]){
					sort = (sort[1]&&sort[1].toUpperCase()=="DESC"?"ASC":"DESC");
					$("#orderBy").val(order+" DESC"!=order+" "+sort?"":order+" "+sort);
				}else{
					$("#orderBy").val(order+" ASC");
				}
				page();
			});
			$("#btnExport").click(function(){
				layer.confirm("确认要导出用户数据吗？",function(index){
                    layer.close(index);
                    $("#searchForm").attr("action","${ctx}/sys/user/export");
                    $("#searchForm").submit();
				});
			});
			$("#btnImport").click(function(){
				$.jBox($("#importBox").html(), {title:"导入数据", buttons:{"关闭":true}, 
					bottomText:"导入文件不能超过5M，仅允许导入“xls”或“xlsx”格式文件！"});
			});
		});
		function page(n,s){
			$("#pageNo").val(n);
			$("#pageSize").val(s);
			$("#searchForm").attr("action","${ctx}/sys/user/");
			$("#searchForm").submit();
	    	return false;
	    }
	</script>
</head>
<body>
	<div id="importBox" class="hide">
		<form id="importForm" action="${ctx}/sys/user/import" method="post" enctype="multipart/form-data"
			style="padding-left:20px;text-align:center;" class="form-search" onsubmit="loading('正在导入，请稍等...');"><br/>
			<input id="uploadFile" name="file" type="file" style="width:330px"/><br/><br/>　　
			<input id="btnImportSubmit" class="btn btn-primary" type="submit" value="   导    入   "/>
			<a href="${ctx}/sys/user/import/template">下载模板</a>
		</form>
	</div>
    <div class="main-content">
        <tags:breadcrumb menuId="20" />
        <div class="page-content">
            <div>
                <form:form id="searchForm" modelAttribute="user" action="${ctx}/sys/user/" method="post" class="form-horizontal">
                    <input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/>
                    <input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>
                    <input id="orderBy" name="orderBy" type="hidden" value="${page.orderBy}"/>
                    <div class="form-group">
                        <label class="col-md-1 control-label no-padding-right">归属公司：</label>
                        <div class="col-md-3">
                            <tags:treeselect id="company" name="company.id" value="${user.company.id}" labelName="company.name" labelValue="${user.company.name}"
                                             title="公司" url="/sys/office/treeData?type=1" cssClass="input-medium" allowClear="true"/>
                        </div>
                        <label class="col-md-1 control-label no-padding-right">登录名：</label>
                        <div class="col-md-3">
                            <form:input path="loginName" htmlEscape="false" maxlength="50" class="input-medium"/>
                        </div>
                        <label class="col-md-1 control-label no-padding-right">归属部门：</label>
                        <div class="col-md-3">
                            <tags:treeselect id="office" name="office.id" value="${user.office.id}" labelName="office.name" labelValue="${user.office.name}"
                                             title="部门" url="/sys/office/treeData?type=2" cssClass="input-medium" allowClear="true"/>
                        </div>
                    </div><hr />
                    <div class="form-group">
                        <label class="col-md-1 control-label no-padding-right">姓名：</label>
                        <div class="col-md-3">
                            <form:input path="name" htmlEscape="false" maxlength="50" class="input-medium"/>
                        </div>
                        <div class="col-md-8" style="float: right">
                            &nbsp;<input id="btnSubmit" class="btn btn-primary" type="submit" value="查询" onclick="return page();"/>
                            &nbsp;<input id="btnExport" class="btn btn-primary" type="button" value="导出"/>
                            &nbsp;<input id="btnImport" class="btn btn-primary" type="button" value="导入"/>
                        </div>
                    </div><hr>
                </form:form>
            </div>
            <div>
                <table id="contentTable" class="table table-striped table-bordered table-hover">
                    <thead><tr><th>归属公司</th><th>归属部门</th><th class="sort loginName">登录名</th><th class="sort name">姓名</th><th>电话</th><th>手机</th><th>角色</th><shiro:hasPermission name="sys:user:edit"><th>操作</th></shiro:hasPermission></tr></thead>
                    <tbody>
                    <c:forEach items="${page.list}" var="user">
                        <tr>
                            <td>${user.company.name}</td>
                            <td>${user.office.name}</td>
                            <td><a href="${ctx}/sys/user/form?id=${user.id}">${user.loginName}</a></td>
                            <td>${user.name}</td>
                            <td>${user.phone}</td>
                            <td>${user.mobile}</td>
                            <td>${user.roleNames}</td>
                            <shiro:hasPermission name="sys:user:edit"><td>
                                <a href="${ctx}/sys/user/form?id=${user.id}">修改</a>
                                <a href="${ctx}/sys/user/delete?id=${user.id}" onclick="return confirmx('确认要删除该用户吗？', this.href)">删除</a>
                            </td></shiro:hasPermission>
                        </tr>
                    </c:forEach>
                    </tbody>
                </table>
                <div class="pagination">${page}</div>
            </div>
        </div>
    </div>
</body>
</html>